﻿<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>    


<head>
    <link rel="stylesheet" href="<c:url value="/easyui/themes/largeicon.css"/>" type="text/css" media="screen" />	
<!--[if IE]><script language="javascript" type="text/javascript" src="excanvas.js" ></script><![endif]-->    
<link rel="stylesheet" type="text/css" href="<c:url value='/jqplot/jquery.jqplot.min.css'/>"  />    
<script language="javascript" type="text/javascript" src="<c:url value='/jqplot/jquery.jqplot.js'/>" ></script>    
<script language="javascript" type="text/javascript" src="<c:url value='/jqplot/plugins/jqplot.pieRenderer.js'/>" ></script>    
<script type="text/javascript" language="javascript">
var charttitle = '';
var line1 = [['1000以下', ${l1}], ['1000-1500', ${l2}],['1500-2000', ${l3}], ['2000-2500', ${l4}],['2500-3000', ${l5}], ['3000-4000', ${l6}],['4000-5000', ${l7}],['5000以上', ${l8}]];    

$(document).ready(function(){    
	showchart();
});    

function showchart(){
	plot1 = $.jqplot('chart', [line1], {    
        title:charttitle,//设置饼状图的标题    
        seriesDefaults: {   
            fill: true,    
            showMarker: false,    
            shadow: false,                
            renderer:$.jqplot.PieRenderer,    
            rendererOptions:{    
            	  showDataLabels: true,
                diameter: undefined, // 设置饼的直径    
                padding: 20, // 饼距离其分类名称框或者图表边框的距离，变相该表饼的直径    
                sliceMargin: 9, // 饼的每个部分之间的距离    
                fill:true, // 设置饼的每部分被填充的状态    
                shadow:true, //为饼的每个部分的边框设置阴影，以突出其立体效果    
                shadowOffset: 2, //设置阴影区域偏移出饼的每部分边框的距离    
                shadowDepth: 5, // 设置阴影区域的深度    
                shadowAlpha: 0.07 // 设置阴影区域的透明度    
            }    
        },    
        legend:{    
            show: true,//设置是否出现分类名称框（即所有分类的名称出现在图的某个位置）    
            location: 'ne', // 分类名称框出现位置, nw, n, ne, e, se, s, sw, w.    
            xoffset: 12, // 分类名称框距图表区域上边框的距离（单位px）    
            yoffset: 12, // 分类名称框距图表区域左边框的距离(单位px)    
        }    
    });    
}

</script>    
</head>
<body>
	<div class="easyui-layout" fit="true">		
		<div region="center" border="false">
			<div id="chart" style="margin-top:20px; margin-left:20px; width:460px; height:500px;"></div> 
		</div>
	</div>
	


	

</body>
